<template>
	<view class="box">
		<view :style="{height:navBarHeight+ 'px'}" class="z-1 bar-box padding-l-r-25"></view>
		<view class="logo-box align-self-center">
			logo
		</view>
        <view class="input-list">
             <text>账号</text>
            <view>
                <input type="text" placeholder="请输入账号" v-model="account">
            </view>
        </view>
        <view class="input-list">
            <text>密码</text>
            <view>
                <input type="password" placeholder="请输入密码" v-model="password">
            </view>
        </view>
        <view class="tips">
            首次登录为初始密码
        </view>
        <view class="logon-box">
            <button @click="logOn">登录</button>
            <view>
                不记得密码？<text>点击这里</text>
            </view>
        </view>
	</view>
</template>

<script>
import {login ,profileUserInfo,getUserInfo} from '@/api/user'
	export default {
		data() {
			return {
				navBarHeight:0,
                account:'',
                password:''
			}
		},
		methods: {

		},
		onLoad() {
			this.getBarHeight()
		},
		methods:{
			getBarHeight() {
				const systemInfo = uni.getSystemInfoSync();
				// 获取状态栏高度
				const statusBarHeight = systemInfo.statusBarHeight;

				// 微信小程序默认导航栏高度（单位为 px）
				const defaultNavBarHeight = 44;

				// 总体头部导航栏高度（包含状态栏）
				this.navBarHeight = statusBarHeight + defaultNavBarHeight;

			},
            logOn(){
                if (!this.account){
                    uni.showToast({
                        title: '请输入账号',
                        icon: 'none'
                    })
                    return
                }
                if (!this.password){
                    uni.showToast({
                        title: '请输入密码',
                        icon: 'none'
                    })
                    return
                }
				login({
					account:this.account,password:this.password
				}).then(res=>{
					if(res.code==1){
						uni.showToast({
							icon:'none',
							title:'登录成功'
						})
                        uni.setStorageSync('userinfo', res.data.userinfo)
                        uni.setStorageSync('token', res.data.userinfo.token)
						uni.switchTab({
							url:'/pages/index/index'
						})
					}else {
                        uni.showToast({
                            icon:'none',
                            title:res.msg
                        })
                    }
				})
            },
		}
	}
</script>

<style lang="scss" scoped>
	.box {
		min-height: 100vh;
		background: linear-gradient( 206deg, #B2E6F1 0%, #E8EBFB 13%, #FFFCFB 37%, #FFFFFF 100%);
	}
    .logo-box {
        justify-content: center;
        align-items: center;
        color: #fff;
        width: 180rpx;
        height: 180rpx;
        margin: 120rpx auto 40rpx;
        background: #43ABC4;
        border-radius: 40rpx  ;
    }
    .input-list {
        padding: 0 48rpx;
        box-sizing: border-box;
        font-size: 28rpx;
        color: #000;
        view {
            height: 90rpx;
            margin: 20rpx 0 30rpx;
            padding: 0 35rpx;
            background: #FFFFFF;
            border-radius: 14rpx  ;
            border: 1px solid #DBDBDB;
            overflow: hidden;
            input {
                height: 100%;
                width: 100%;
            }
        }
    }
    .tips {
        font-size: 26rpx;
        color: #F3641E;
        text-align: right;
        margin-right: 45rpx;
    }
    .logon-box {
        padding: 0 45rpx;
        text-align: center;
        font-size: 28rpx;
        button {
            width: 660rpx;
            height: 90rpx;
            margin: 70rpx 0 38rpx;
            background: #43ABC4;
            color: #fff;
            line-height: 90rpx;
            font-size: 28rpx;
            border-radius: 14rpx  ;
            border: 0;
        }
        view {
            color: #4D4D4D;
            text {
                color: #43ABC4;
            }
        }
    }
</style>
